import React, { ReactNode } from 'react';

import classNames from 'classnames';

import s from './Container.module.scss';

type Props = {
  isVisible?: boolean;
  children: ReactNode;
  isSmallGap?: boolean;
  isModal?: boolean;
  className?: string;
};

export const Container = ({ children, isVisible, isSmallGap, isModal, className }: Props) => (
  <div
    className={classNames(
      isVisible && s.visible,
      isModal ? s.isModalContainer : s.container,
      { [s.smallGap]: isSmallGap },
      className,
    )}
  >
    {children}
  </div>
);
